<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>悬停时有旋转效果的图标</title>
    <link rel="stylesheet" href="./style.css">
</head>
<body>
<!-- 用到的icon是源于Ionicons官网的，也可以使用FontAwesome图标 -->
<!-- 如果官网打不开，可以查询https://www.jianshu.com/p/a69829206ac5?_u_u_u=0.954503959603624 -->
<a href="#" class="icon green ion-ios-star-outline"></a>
<a href="#" class="icon blue ion-ios-list-outline"></a>
<a href="#" class="icon navy ion-ios-chatboxes-outline"></a>
<a href="#" class="icon yellow ion-ios-home-outline"></a>
<a href="#" class="icon red ion-ios-pie-outline"></a>
<a href="#" class="icon ion-ios-gear-outline"></a> 
<!-- partial -->
  <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js'></script><script src="./script.js"></script>
</body>
</html>